<template>
  <div>
    <canvas id="three" />
  </div>
</template>

<script setup>
import { onMounted, onBeforeUnmount, onUnmounted } from 'vue'
import init, { destroyContext } from './person';

onMounted(() => {
  const canvas = document.querySelector('#three')
  init(canvas)
})

onBeforeUnmount(() => {
  destroyContext()
})

onUnmounted(() => {
  console.log('Person组件卸载了')
})
</script>

<style scoped>
#three {
  width: 100%;
  height: 100%;
  position: fixed;
  left: 0;
  top: 0;
}
</style>